<template>
  <div class="body-box">
    <window-title title="条件查询"></window-title>
    <el-form style="margin-top:20px" class="demo-form-inline" label-width="85px">
      <el-row :gutter="20">
        <el-col :span="8">
          <el-form-item label="跑团名称：">
            <el-input size="mini" placeholder="请输入活动名称"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="关键字：">
            <el-input size="mini" placeholder="请输入跑团名称"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="4">
          <el-form-item  label-width="10px">
            <el-button class="com-btn" icon="el-icon-search" size="mini">查询</el-button>
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>
    <window-title title="用户列表"></window-title>
    <el-table   :header-cell-style="{background:'#f8f8f8',color:'#333',borderRight:0}" border size="mini" :data="tableData" style="width: 100%;margin-top:20px">
      <el-table-column type="index" label="序号" ></el-table-column>
      <el-table-column prop="id" label="ID" ></el-table-column>
      <el-table-column prop="userName" label="用户名" ></el-table-column>
      <el-table-column prop="gender" width="60px" label="性别" ></el-table-column>
      <el-table-column prop="run" min-width="80px" label="跑团" ></el-table-column>
      <el-table-column prop="city" min-width="80px" label="城市" ></el-table-column>
      <el-table-column prop="joinDate" width="140px" label="注册时间" ></el-table-column>
      <el-table-column prop="state" width="80px"  label="状态" ></el-table-column>
      <el-table-column label="操作" >
        <template slot-scope="scope">
          <el-button @click="see(scope.row.id)" size="mini" icon="el-icon-view">查看</el-button>
        </template>
      </el-table-column>
    </el-table>
        <div class="page-box">
          <el-pagination
            background
            small
            :current-page="current_page"
            :page-size="per_page"
            layout="total, prev, pager, next, jumper"
            :total="30"
          ></el-pagination>
        </div>
  </div>
</template>

<script>
import windowTitle from "../../components/unit/title.vue";

export default {
  components: { windowTitle },
  data() {
    return {
      current_page:1,
      per_page:10,
      team_name: "",
      user_name: "",
      list_head: [
        { title: "Id", key: "Id", width: "80px" },
        { title: "用户名", key: "" },
        { title: "性别", key: "" },
        { title: "跑团", key: "" },
        { title: "城市", key: "" },
        { title: "注册时间", key: "" },
        { title: "状态", key: "" },
        { title: "操作", key: "" }
      ],
      tableData:[
          {
            id:'2146',
            userName:'是否',
            gender:'男',
            run:'合肥团',
            city:'合肥',
            joinDate:'2020-12-03 12:12:12',
            state:'可用'
          }
      ],
      list: {
        current_page: 1,
        data: []
      }
    };
  },
  methods: {
    see(index) {
      console.log(index)
      this.$router.push({path:'/stage/user/info',query:{id:index}})
    }
  }
};
</script>

<style>
</style>